<template>
  <div class="app-container">
    <help></help>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane name="await" label="待审核">
        <el-table border v-loading="loading" :data="list">
          <el-table-column align="center" label="经营户类型">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.agriculture_manage_type" :value="scope.row.type" />
            </template>
          </el-table-column>
          <el-table-column align="center" label="注册地区">
            <template slot-scope="scope">
              <agriculture-region :value.sync="scope.row.deptId" type="text" />
            </template>
          </el-table-column>
          <el-table-column align="center" label="提交时间" prop="createTime" />
          <el-table-column align="center" label="提交人" prop="createBy" />
          <el-table-column align="center" label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleInfo(scope.row)">审核</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="query.pageNum"
          :limit.sync="query.pageSize"
          @pagination="getList"
        />
      </el-tab-pane>
      <el-tab-pane name="off" label="已审核">
        <el-table border v-loading="loading" :data="list">
          <el-table-column align="center" label="经营户类型">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.agriculture_manage_type" :value="scope.row.type" />
            </template>
          </el-table-column>
          <el-table-column align="center" label="注册地区" prop="name">
            <template slot-scope="scope">
              <agriculture-region :value.sync="scope.row.deptId" type="text" />
            </template>
          </el-table-column>
          <el-table-column align="center" label="提交时间" prop="createTime" />
          <el-table-column align="center" label="提交人" prop="createBy" min-width="120" show-overflow-tooltip />
          <el-table-column align="center" label="审核结果">
            <template slot-scope="scope">
              <dict-tag :options="dict.type.agriculture_check_state" :value="scope.row.state" />
            </template>
          </el-table-column>
          <el-table-column align="center" label="审核人" prop="auditBy" />
          <el-table-column align="center" label="审核备注" prop="reason" />
          <el-table-column align="center" label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="handleInfo(scope.row)">详情</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="query.pageNum"
          :limit.sync="query.pageSize"
          @pagination="getList"
        />
      </el-tab-pane>
    </el-tabs>
    <help-dialog :visible.sync="corpVisible" title="企业审核">
      <el-form size="small" label-width="160px">
        <div class="label">经营户信息</div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="企业/个人名称" prop="name">
              <el-input v-model="queryParam.name" placeholder="请输入企业/个人名称" clearable disabled />
            </el-form-item>
            <el-form-item label="企业类型" prop="corpType">
              <el-select
                v-model="queryParam.corpType"
                placeholder="请选择企业类型"
                clearable
                disabled
                style="width: 100%"
              >
                <el-option
                  v-for="item in dict.type.agriculture_corp_type"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="法人/负责人证件号码" prop="idcardNumber">
              <el-input v-model="queryParam.idcardNumber" placeholder="请输入法人/负责人证件号码" clearable disabled />
            </el-form-item>
            <el-form-item label="联系方式" prop="phone">
              <el-input v-model="queryParam.phone" maxlength="11" placeholder="请输入联系方式" clearable disabled />
            </el-form-item>
            <el-form-item label="地址" prop="address">
              <el-input v-model="queryParam.address" placeholder="请输入地址" clearable disabled />
            </el-form-item>
            <el-form-item label="营业执照附件" prop="file">
              <y-show-all-file :path="queryParam.file"></y-show-all-file>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="统一社会信用代码" prop="corpCode">
              <el-input v-model="queryParam.corpCode" placeholder="请输入统一社会信用代码" clearable disabled />
            </el-form-item>
            <el-form-item label="法人/负责人姓名" prop="legalMan">
              <el-input v-model="queryParam.legalMan" placeholder="请输入法人/负责人姓名" clearable disabled />
            </el-form-item>
            <el-form-item label="联络人姓名" prop="linkMan">
              <el-input v-model="queryParam.linkMan" placeholder="请输入联络人姓名" clearable disabled />
            </el-form-item>
            <el-form-item label="注册地区">
              <agriculture-region :value.sync="queryParam.organization" disabled />
            </el-form-item>
            <el-form-item label="经营范围" prop="manageRange">
              <el-input
                v-model="queryParam.manageRange"
                type="textarea"
                :rows="2"
                placeholder="请输入经营范围"
                clearable
                disabled
              />
            </el-form-item>
            <el-form-item label="状态" prop="corpState">
              <el-select v-model="queryParam.corpState" placeholder="请选择状态" clearable disabled style="width: 100%">
                <el-option
                  v-for="item in dict.type.agriculture_state"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="label">转让信息</div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="土地编码/地宗号" prop="landCode">
              <el-input v-model="queryParam.landCode" placeholder="请输入土地编码/地宗号" clearable disabled />
            </el-form-item>
            <el-form-item label="所属地区" prop="transferorArea">
              <el-input v-model="queryParam.transferorArea" placeholder="请输入所属地区" clearable disabled />
            </el-form-item>
            <el-form-item label="经营期限" prop="manageTime">
              <el-input v-model="queryParam.manageTime" placeholder="请输入经营期限" clearable disabled />
            </el-form-item>
            <el-form-item label="坐标（西至）" prop="west">
              <el-input v-model="queryParam.west" disabled placeholder="请输入坐标（西至）" />
            </el-form-item>
            <el-form-item label="坐标（北至）" prop="north">
              <el-input v-model="queryParam.north" disabled placeholder="请输入坐标（北至）" />
            </el-form-item>
            <el-form-item label="面积（亩）" prop="area">
              <el-input v-model="queryParam.area" disabled placeholder="请输入面积（亩）" clearable />
            </el-form-item>
            <el-form-item label="合同附件" prop="contractFile">
              <y-show-all-file :path="queryParam.contractFile"></y-show-all-file>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="转出方" prop="transferor">
              <el-input v-model="queryParam.transferor" placeholder="请输入转出方" clearable disabled />
            </el-form-item>
            <el-form-item label="流转方式" prop="circulationType">
              <el-select
                v-model="queryParam.circulationType"
                placeholder="请选择流转方式"
                clearable
                disabled
                style="width: 100%"
              >
                <el-option
                  v-for="item in dict.type.circulation_type"
                  :key="item.value"
                  :value="item.value"
                  :label="item.label"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="流转费（亩）" prop="circulationFee">
              <el-input v-model="queryParam.circulationFee" placeholder="请输入流转费（亩）" clearable disabled />
            </el-form-item>
            <el-form-item label="坐标（东至）" prop="east">
              <el-input v-model="queryParam.east" disabled placeholder="请输入坐标（东至）" />
            </el-form-item>
            <el-form-item label="坐标（南至）" prop="south">
              <el-input v-model="queryParam.south" disabled placeholder="请输入坐标（南至）" />
            </el-form-item>
            <el-form-item label="总计（元）" prop="total">
              <el-input v-model="queryParam.total" placeholder="请输入" clearable disabled />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="queryParam.state == 0">
          <el-col :span="12">
            <el-form-item label="操作">
              <el-radio v-model="queryParam.value" label="1">同意</el-radio>
              <el-radio v-model="queryParam.value" label="2">驳回</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="驳回意见">
              <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="queryParam.reason" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span v-if="queryParam.state == 0" slot="footer" class="dialog-footer">
        <el-button @click="corpVisible = false">取 消</el-button>
        <el-button type="primary" @click="handleUpdate">确 定</el-button>
      </span>
    </help-dialog>
    <help-dialog :visible.sync="personVisible" title="个人审核">
      <el-form size="small" label-width="160px">
        <div class="label">经营户信息</div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="姓名" prop="name">
              <el-input v-model="queryParam.name" placeholder="请输入姓名" clearable disabled />
            </el-form-item>
            <el-form-item label="家庭地址" prop="address">
              <el-input v-model="queryParam.address" placeholder="请输入家庭地址" clearable disabled />
            </el-form-item>
            <el-form-item label="身份证反面">
              <y-show-all-file :path="queryParam.file2"></y-show-all-file>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系方式" prop="phone">
              <el-input v-model="queryParam.phone" maxlength="11" placeholder="请输入联系方式" clearable disabled />
            </el-form-item>
            <el-form-item label="身份证正面">
              <y-show-all-file :path="queryParam.file1"></y-show-all-file>
            </el-form-item>
          </el-col>
        </el-row>
        <div class="label">经营户信息</div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="转出方" prop="transferor">
              <el-input v-model="queryParam.transferor" placeholder="请输入转出方" clearable disabled />
            </el-form-item>
            <el-form-item label="流转方式" prop="circulationType">
              <el-select
                v-model="queryParam.circulationType"
                placeholder="请选择流转方式"
                clearable
                disabled
                style="width: 100%"
              >
                <el-option
                  v-for="item in dict.type.circulation_type"
                  :key="item.value"
                  :value="item.value"
                  :label="item.label"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="流转费（亩）" prop="circulationFee">
              <el-input v-model="queryParam.circulationFee" placeholder="请输入流转费（亩）" clearable disabled />
            </el-form-item>
            <el-form-item label="土地编码/地宗号" prop="landCode">
              <el-input v-model="queryParam.landCode" placeholder="请输入土地编码/地宗号" clearable disabled />
            </el-form-item>
            <el-form-item label="坐标（东至）" prop="east">
              <el-input v-model="queryParam.east" disabled placeholder="请输入坐标（东至）" />
            </el-form-item>
            <el-form-item label="坐标（南至）" prop="south">
              <el-input v-model="queryParam.south" disabled placeholder="请输入坐标（南至）" />
            </el-form-item>
            <el-form-item label="合同附件" prop="contractFile">
              <y-show-all-file :path="queryParam.contractFile"></y-show-all-file>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="所属地区" prop="transferorArea">
              <el-input v-model="queryParam.transferorArea" placeholder="请输入所属地区" clearable disabled />
            </el-form-item>
            <el-form-item label="经营期限" prop="manageTime">
              <el-input v-model="queryParam.manageTime" placeholder="请输入经营期限" clearable disabled />
            </el-form-item>
            <el-form-item label="总计（元）" prop="total">
              <el-input v-model="queryParam.total" placeholder="请输入" clearable disabled />
            </el-form-item>
            <el-form-item label="坐标（西至）" prop="west">
              <el-input v-model="queryParam.west" disabled placeholder="请输入坐标（西至）" />
            </el-form-item>
            <el-form-item label="坐标（北至）" prop="north">
              <el-input v-model="queryParam.north" disabled placeholder="请输入坐标（北至）" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="queryParam.state == 0">
          <el-col :span="12">
            <el-form-item label="操作">
              <el-radio v-model="queryParam.value" label="1">同意</el-radio>
              <el-radio v-model="queryParam.value" label="2">驳回</el-radio>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="驳回意见">
              <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="queryParam.reason" />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span v-if="queryParam.state == 0" slot="footer" class="dialog-footer">
        <el-button @click="personVisible = false">取 消</el-button>
        <el-button type="primary" @click="handleUpdate">确 定</el-button>
      </span>
    </help-dialog>
  </div>
</template>

<script>
import auditApi from '@/api/manage/audit'
import AgricultureRegion from '@/components/AgricultureRegion/AgricultureRegion'

export default {
  dicts: [
    'agriculture_manage_type',
    'circulation_type',
    'agriculture_check_state',
    'agriculture_corp_type',
    'agriculture_state'
  ],
  components: { AgricultureRegion },
  data() {
    return {
      activeName: 'await',
      query: {
        pageNum: 1,
        pageSize: 10,
        state: 0
      },
      loading: false,
      list: [],
      total: 0,
      queryParam: {},
      corpVisible: false,
      personVisible: false,
      manageId: ''
    }
  },
  created() {
    this.getList()
  },
  methods: {
    handleClick(e) {
      this.query.state = e.index
      this.getList()
    },
    getList() {
      this.loading = true
      auditApi.auditList(this.query).then((res) => {
        this.list = res.rows
        this.total = res.total
        this.loading = false
      })
    },
    handleInfo(row) {
      this.manageId = row.manageId
      auditApi.auditDetail({ manageId: row.manageId }).then((res) => {
        res.data.value = '1'
        if (res.data.cardFile) {
          const arr = res.data.cardFile.split(',')
          res.data.file1 = arr[0]
          res.data.file2 = arr[1]
        }
        this.queryParam = res.data
        if (row.type == 1) this.personVisible = true
        else this.corpVisible = true
      })
    },
    handleUpdate() {
      if (!this.queryParam.reason && this.queryParam.value == 2) {
        return this.$message.warning('请输入备注')
      }
      if (this.queryParam.value == 1) {
        auditApi.auditPass({ manageId: this.manageId }).then((res) => {
          this.$message.success('审核同意')
        })
      } else {
        auditApi.auditRefused({ manageId: this.manageId }).then((res) => {
          this.$message.success('审核驳回')
        })
      }
      this.corpVisible ? (this.corpVisible = false) : ''
      this.personVisible ? (this.personVisible = false) : ''
    }
  }
}
</script>

<style scoped>
.label {
  font-size: 16px;
  font-weight: 700;
  color: #409eff;
  margin: 20px 0;
  border-left: 3px solid;
  padding-left: 5px;
  line-height: 20px;
}
</style>